<template>
	<view class="Recharge_content">
		<view class="kuang">
			<view class="title">
				<view class="inline-block left">
					<image src="../../static/image/left.png" mode="" @tap="back"></image>
				</view>
				<view class="inline-block titleText" :style="i18n.rechargetitle">
					{{i18n.transfer}}
				</view>
			</view>
			<view class="choice">
				<view class="example-body" style="width: 100%;" @tap="showList" >
					<text>{{i18n.selectToken}}</text>
					<text>{{symbol}}</text>
					<image :src="isList?'../../static/image/upIcon.png':'../../static/image/downIcon.png'" class="downIcon"></image>
				</view>
				<view class="symolList" v-if="isList">
					<view class="symbolItem" v-if="symbolList.length >0"
					 @tap="clickItem(item)"
					 v-for="(item,index) in symbolList" :key="index">
							<image v-if="item.assetId==0"  src="../../static/image/icon_detail.png"></image>
							<image  v-else src="../../static/image/greylogo.png"></image>
						<text>{{item.assetName}}  ({{item.symbol}})</text>
					</view>
					<view style="text-align: center;" v-else>{{i18n.wzc}}</view>
				</view>
			</view>
			<view class="numinput" :style="i18n.examplebody">
				<text :style="i18n.numinputstyle" >{{i18n.receiptaccount}}：</text>
				<input class="uni-input" type="text" placeholder="" v-model="toAccountName" style="width: 60%;	" />
			</view>
			<view class="balance">
				<view class="balancetitle">
					<image src="../../static/image/FOEXCOM.png" mode=""></image>
				</view>
				<view class="balancetext">
					<image src="../../static/image/pinkmap.png" mode="" class="map"></image>
					<view class="current_balance">
						<text>{{i18n.Balance}}</text>
						<text class="font-weight" >{{currentAmount}}</text>
					</view>
					<view class="hx"></view>
					<view class="mount">
						<div>
						<input class="uni-input" type="number" :placeholder="i18n.hdBalance" v-model="amount" placeholder-style="font-size:14px;color:rgba(25, 25, 48, 0.5)"
						 style="font-weight: 600;color:rgba(25, 25, 48, 0.5)" />
						 </div>
						 <div style="font-weight: 600;color:rgba(25, 25, 48, 0.5);float: right;" >{{symbol}}</div>
					</view>
				</view>
			</view>
			<view class="text remarkstyle">
				<view class="inline-block">
					{{i18n.remarkstyle}}
				</view>
				<textarea auto-height class="textarea" v-model="remark"  />
			</view>
			<view class="bottombutton" @tap="recharge">
				{{i18n.transfer}}
			</view>
		</view>
		<password v-if="show" :gasPrice="100" :gasLimit="1000000" @close="close" @callback="callback" :yzpassword="i18n.yzpassword" :btnl="i18n.btn1" :btnr="i18n.btn2" :placeholder="i18n.placeholder" :passprice="i18n.passprice" :pwdtitle="i18n.pwdtitle" :cap="i18n.cap"></password>
		
	</view>
</template>

<script>
	import uniCombox from "../../components/uni-combox/uni-combox"
	import uniComboxzz from "../../components/uni-comboxzz/uni-comboxzz"
	import uniSection from '../../components/uni-section/uni-section'
	import * as oex from 'oex-web3'; 
	import account from '../../common/account.js'
	import {myMixins} from '../../common/mixins.js'
	import password from '../../components/password/password.vue'
	import BigNumber from 'bignumber.js';
	import payment from '../../common/payment.js'
	export default {
		computed: {
			i18n() {
				return this.$t('user')
			}
		},
		mixins:[myMixins],
		data() {
			return {
				 //币种选择
				 toAccountName:"",  //转出账户
				 amount:"", //转出数量
				 remark:"",   //转出备注
				 show: false, //支付密码
				 password:"", //支付密码
				 symbolList:[], //当前账户所持有的币种列表
				 balances:[] ,//当前账户资产
				 assetIdList:[],
				 currentAmount:"",
				 assetId: "",
				 decimals: "",
				 index:0,
				 isList:false,
				 assetName:"",
				 symbol:""
			}
		},
		components:{password},
		onLoad() {
			this.getCurrentAccountInfo();//加载当前账户资产
		},
		methods: {
			showList(){
				this.isList = !this.isList;
			},
			clickItem(item){
				this.symbol =item.symbol;
				this.assetName =item.assetName;
				this.assetId = item.assetId;
				this.decimals = item.decimals;
				this.currentAmount  = item.balance/Math.pow(10,item.decimals);
				this.isList = false;
			},
			back(){
				//返回上一页
				this.$CommonJS.navigateBack()
			},
			async getCurrentAccountInfo(){
				//加载当前账户信息
				 let _this = this;
				const nodeInfo = uni.getStorageSync('nodeInfo');

				 oex.utils.setApp();
				 
				 const data = await oex.account.getAccountExByName(this.account_info.accountName); //请求参数
				 this.$CommonJS.request(nodeInfo,"POST",data).then( res => {
				 		this.balances = res.data.result.balances;
						if(res.data.result.balances.length > 0){
							//根据资产id获取资产详情
								_this.getInfoByAssetsID(res.data.result.balances);
						}else{
								_this.symbolList.push(_this._i18n.locale == 'zh_CN' ? '当前账户暂无资产':'There are no assets in the current account')
					
						}
				 }).catch(error => {
				 })
			},
			getInfoByAssetsID(data){
			//根据资产id获取资产详情
				if(data.length<1){
					uni.hideLoading()
					return;
				}
				const _this = this;
				const nodeInfo = uni.getStorageSync('nodeInfo');
				data.map(item =>{
					account.getCoin(nodeInfo,item.assetID).then(result =>{
						const obj = {
							assetID:result.data.result.assetId,
							symbol:result.data.result.symbol,
							balance:item.balance,
							decimals:result.data.result.decimals,
							assetName:result.data.result.assetName
						}
						_this.assetIdList.push(obj);
						const asset = {
							assetName:result.data.result.assetName,
							symbol:result.data.result.symbol.toUpperCase(),
							assetId:result.data.result.assetId,
							balance:item.balance,
							decimals:result.data.result.decimals,
						}
						_this.symbolList.push(asset);
						uni.hideLoading()
					})
				})
			},
			async recharge(){
				const _this = this;
				//转账
				if(this.symbolList.length < 1){
					this.$CommonJS.showToast(_this._i18n.locale == 'zh_CN' ? '当前账户暂无资产,不能转账':'There is no asset in the current account, no transfer is allowed');
					return;
				}
				if(!this.assetName){
					this.$CommonJS.showToast(_this._i18n.locale == 'zh_CN' ? '请选择币种':'Please select currency');
					return;
				}
				if(!this.toAccountName){
					this.$CommonJS.showToast(_this._i18n.locale == 'zh_CN' ? '请输入收款账户':'Please input the collection account');
					return;
				}
				if(this.account_info.accountName == this.toAccountName){
					this.$CommonJS.showToast(_this._i18n.locale == 'zh_CN' ? '非法操作,不能转账当前账户':'Please input the illegal operation of the collection account. The current account cannot be transferred');
					return;
				}
				if(!this.amount || this.amount == 0){
					this.$CommonJS.showToast(_this._i18n.locale == 'zh_CN' ? '请输入转账数量':'Please input the transfer quantity');
					return;
				}
				if(this.amount > Number(this.currentAmount)){
					this.$CommonJS.showToast(_this._i18n.locale == 'zh_CN' ? '账户余额不足':'Insufficient account balance');
					return;
				}
				this.toAccountName = this.toAccountName.trim();
				//验证转出的账户是否存在
				oex.utils.setApp();
				var data = await oex.account.getAccountExByName(this.toAccountName); //请求参数
				const nodeInfo = uni.getStorageSync('nodeInfo');
				this.$CommonJS.request(nodeInfo,"POST",data).then( res => {
						if(res.data.result == null){
							_this.$CommonJS.showToast(_this._i18n.locale == 'zh_CN' ? '账户不存在':'Account does not exist')
							return;
						}
						//
						_this.show = true;
				}).catch(error => {
				})
			},
			close(){
				//关闭支付框
				this.show = false
			},
			callback(privateKey,gasPrice,gasLimit){
				const _this=this
				this.show = false
				//支付参数(currentAccountName,toAccountName,assetId,amount,decimals,privateKey,gasPrice,gasLimit)
				payment.payment(this.account_info.accountName,this.toAccountName,this.assetId,this.amount,this.remark,this.decimals,privateKey,gasPrice,gasLimit).then(paymentInfo =>{
					if(paymentInfo){
						uni.showToast({
							title:_this._i18n.locale == 'zh_CN' ? '转账成功':'Transfer successful'
							// title:'转账成功'
						})
					}
				}).catch(err =>{
				})
			}
			
		}
	}
</script>

<style lang="stylus">
	@import "../../static/stylus/recharge/recharge.stylus"
	
</style>
